<template>
	<view>
		<view class="address-window" :class="address==true ? 'on' :''">
			<view class='title'>操作 <view class="iconfont"><u-icon name="close" color="#888" size="20"
						@click='close'></u-icon></view>
			</view>
			<view class='list flex-all'>
				<view class="imgwrap" @click="toJump('/pages/love/timeLock?shipid='+shipid)">
					<image src="/static/imgs/cz1.png" mode="widthFix" />
					<view>时间锁</view>
				</view>
				<view v-if="isNow" class="imgwrap" @click="relieve()">
					<image src="/static/imgs/cz2.png" mode="widthFix" />
					<view>解除关系</view>
				</view>
			</view>
		</view>
		<view class='mask' catchtouchmove="true" :hidden='address==false' @click='close'></view>
	</view>
</template>

<script>
	import {
		msgList,
		sendMessage
	} from '@/api/chat.js';
	export default {
		props: {
			address: {
				type: Boolean,
				default: false,
			},
			isNow: {
				type: Boolean,
				default: false,
			},
			shipid: {
				type: Number,
				default: 0,
			},
			messageType: {
				type: String,
				default: '',
			},
			userid: {
				type: Number,
				default: 0,
			},

		},
		data() {
			return {

			};
		},

		methods: {
			close: function() {
				this.$emit('changeClose');
			},
			toJump(url) {
				if (!url) return
				uni.navigateTo({
					url
				});
			},
			//解除关系
			async relieve() {
				let content = '';
				if(this.messageType=='bestiestate'){
					content = '我已经发起闺蜜解除申请,请等待冷静期结束后操作'
				}
				if(this.messageType=='lovestate'){
					content = '我已经发起情侣解除申请,请等待冷静期结束后操作'
				}
				let data = {
					'messageType': this.messageType,
					'user_id': this.userid,
					'content': content
				}
				console.log(data,'0------------------');
				const res = await sendMessage(data).then(res => {
					console.log(res, '发送消息');
					if(res.code == 1){
						this.isNow = false
						uni.showToast({
							'icon':'none',
							'title':res.msg,
							'duration':1500
						})
					}
				});
			}
		}
	}
</script>

<style scoped lang="scss">
	.address-window {
		background-color: #f6f6f6;
		position: fixed;
		bottom: 0;
		left: 0;
		width: 100%;
		z-index: 101;
		transform: translate3d(0, 100%, 0);
		transition: all .3s cubic-bezier(.25, .5, .5, .9);
		border-radius: 30rpx 30rpx 0 0;
	}

	.address-window.on {
		transform: translate3d(0, 0, 0);
	}

	.address-window .title {
		font-size: 28rpx;
		text-align: center;
		height: 100rpx;
		color: $uni-text-color-placeholder;
		line-height: 100rpx;
		position: relative;
	}

	.address-window .title .iconfont {
		position: absolute;
		right: 30rpx;
		top: 50%;
		transform: translate(0, -50%);
	}

	.address-window .list {
		padding: 50rpx 0;
		justify-content: flex-start;
	}

	.address-window .list .imgwrap {
		width: 20%;
		text-align: center;
	}

	.address-window .list .imgwrap image {
		width: 90rpx;
	}

	.address-window .list .imgwrap view {
		font-size: 24rpx;
		color: $uni-text-color;
		margin-top: 20rpx;
	}
</style>